<template>
  <div class="box1">
    <Hand title="意见反馈" :left="true" :iconbool="false" @back="backPrve">
      <p class="p" @click="goFather">提交</p>
    </Hand>
    <div class="bb">
      <p>反馈标题</p>
      <input
        type="text"
        name=""
        id=""
        style="background: rgba(236, 253, 250, 1); font-size: 20px"
        placeholder="点击输入标题"
        v-model="msg"
      />
    </div>
    <div class="b2">
      <p>反馈详情</p>
    </div>
    <input
      type="text"
      name=""
      id=""
      style="background: rgba(236, 253, 250, 1); font-size: 20px"
      placeholder="在这里输入反馈详情"
      class="input1"
    />
  </div>
</template>

<script setup>
import Hand from "../../components/Hand.vue";
import { useRouter } from "vue-router";
import { ref } from "vue";
import { showSuccessToast, showFailToast } from "vant";

const msg = ref("");

const router = useRouter();

const backPrve = () => {
  router.go(-1);
};
const goFather = () => {
  if (msg.value !== "") {
    router.push("/SetUp");
  } else {
    showFailToast("信息未完善");
  }
};
</script>

<style scoped>
.box1 {
  display: flex;
  flex-direction: column;
  background: #ecfdfa;
  height: 100vh;
  font-weight: bold;
}

.p {
  font-family: "微软雅黑 Bold", "微软雅黑 Regular", "微软雅黑";
  font-weight: 700;
  font-size: 4.667vw;
  color: #ffffff;
}

.bb {
  display: flex;
  border-left: 1.333vw solid red;
  padding-left: 2.667vw;
  margin-left: 6.667vw;
  margin-top: 4.667vw;
}

.b2 {
  display: flex;
  flex-direction: column;
  border-left: 1.333vw solid blue;
  padding-left: 2.667vw;
  margin-left: 6.667vw;
  margin-top: 4.667vw;
}
input {
  font-weight: normal;
  font-size: 2.667vw;
  text-indent: 4vw;
}
.input1 {
  font-weight: normal;
  font-size: 2.667vw;
  margin-top: 4.333vw;
  margin-left: 6.667vw;
}
</style>
